<!doctype html>
<html>
  <head>
    <link rel="stylesheet" href="index.css" />
    <meta charset="UTF-8" />
    <meta />
  </head>

  <body>
    <div id="nav-area-placeholder"></div>
    <script src="fragment-loader.js"></script>

    <div id="editor-area"></div>

    <div id="menu-area" hidden>
      <div class="row" id="menu-handle"></div>

      <div class="row" id="menu-tabs-body">
        <div class="row" id="menu-tabs-row">
          <ul class="tabs" id="menu-tabs">
            <li class="tab col s2"><a class="active" href="#general-tab">general</a></li>
            <li class="tab col s2"><a href="#transmit-tab">transmit</a></li>
            <li class="tab col s2"><a href="#advance-tab">advance</a></li>
            <li class="tab col s2"><a href="#fileops-tab">file ops</a></li>
            <li class="tab col s2"><a href="#chart-tab">chart</a></li>
            <li class="tab col s2"><a href="#about-tab">about</a></li>
          </ul>
        </div>

        <div id="general-tab-placeholder"></div>
        <div id="transmit-tab-placeholder"></div>
        <div id="advance-tab-placeholder"></div>
        <div id="fileops-tab-placeholder"></div>
        <div id="chart-tab-placeholder"></div>
        <div id="about-tab-placeholder"></div>
        <!-- Tab fragments loaded by fragment-loader.js -->
      </div>
    </div>

    <div id="bar-area-placeholder"></div>
    <!-- Bar area fragment loaded by fragment-loader.js -->

    <!-- You can also require other files to run in this process -->
    <script>
      var indexScript = document.createElement('script')
      indexScript.src = 'index.js'
      indexScript.onload = function () {
        setTimeout(function () {
          var hmScript = document.createElement('script')
          hmScript.src = 'hm.js'
          hmScript.async = true
          document.body.appendChild(hmScript)
        }, 5000)
      }
      document.body.appendChild(indexScript)
    </script>
  </body>
</html>
